<script setup>
import props from './props'
import { ref } from 'vue'
defineProps(props)
defineOptions({
  name: 'LeeButton',
})
const buttonRef = ref(null)
defineExpose({
  ref: buttonRef,
})
</script>

<template>
  <button
    ref="buttonRef"
    class="lee-button"
    :class="{
      [`lee-button--${type}`]: type,
      [`lee-button--${size}`]: size,
      'is-plain': plain,
      'is-round': round,
      'is-circle': circle,
      'is-disabled': disabled || loading,
    }"
    :disabled="disabled || loading"
    :style="!border ? { border: 'none' } : {}"
  >
    <lee-icon v-if="loading" icon="spinner" spin />
    <lee-icon v-if="icon" :icon="icon" />
    <span v-if="$slots.default"><slot /></span>
  </button>
</template>
